<!--
    Last modified: 2022-06-25 18:40:11
    Url: https://www.axui.cn
-->
<!DOCTYPE html>
<html>
<head>

    <meta name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=no"/>
    <meta name="apple-mobile-web-app-capable" content="yes"/>
    <meta name="apple-mobile-web-app-status-bar-style" content="black"/>
    <meta name="apple-touch-fullscreen" content="yes"/>
    <meta name="format-detection" content="email=no"/>
    <meta name="wap-font-scale" content="no"/>
    <meta name="viewport" content="user-scalable=no, width=device-width"/>
    <meta content="telephone=no" name="format-detection"/>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>

    <title>登录卡片-AXUI前端框架|斧子框架，面向设计的自主国产前端框架</title>
    <meta name="description" content="，AXUI前端框架是面向设计，满足设计多样化需求的前端解决方案，减少或剔除JS文件资源和API。AXUI前端框架原则是能用css写的不用js；能用js写的不用插件；能用插件的不重复引用插件。核心文件只有ax.css和ax.js，加载速度飞快。">
    <meta name="keywords" content=",前端框架,UI,CSS3,HTML5,原生JS,面向设计,前端工程师">

    <link href="css/ax.css" rel="stylesheet" type="text/css">
    <link href="css/ax-response.css" rel="stylesheet" type="text/css">
    <link href="css/main.css" rel="stylesheet" type="text/css">
</head>

<body class="ax-align-origin">


<div class="login ax-shadow-cloud ax-radius-md">
    <div class="ax-row ax-radius-md ax-split">
        <div class="ax-col ax-col-14 ax-radius-left ax-radius-md cover"></div>
        <div class="ax-col ax-col-10">
            <div class="core">

                <div class="ax-break"></div>

                <div class="ax-tab" axTab>

                    <ul class="ax-row ax-tab-nav ax-menu-tab">
                        <a href="###" class="ax-item">登录账号</a>
                        <a href="###" class="ax-item">注册新用户</a>
                        <li class="ax-col"></li>
                    </ul>

                    <ul class="ax-tab-content">
                        <li>
                            <form>

                                <div class="ax-break"></div>
                                <div class="ax-break ax-hide-tel"></div>

                                <div class="ax-form-group">
                                    <div class="ax-flex-row">
                                        <div class="ax-form-con">
                                            <div class="ax-form-input"><span class="ax-pos-left" style="width: 2.4rem;"><i class="ax-iconfont ax-icon-me-f"></i></span><input name="username" value="admin" placeholder="输入登录名称" type="text"><span class="ax-pos-right"><a href="###" class="ax-iconfont ax-icon-close ax-val-none"></a></span></div>
                                        </div>
                                    </div>
                                </div>

                                <div class="ax-break-md"></div>

                                <div class="ax-form-group">
                                    <div class="ax-flex-row">
                                        <div class="ax-form-con">
                                            <div class="ax-form-input"><span class="ax-pos-left" style="width:2.4rem;"><i class="ax-iconfont ax-icon-lock-f"></i></span>
                                                <input name="password" placeholder="输入密码" type="password"><span class="ax-pos-right"><a href="###" class="ax-iconfont ax-icon-close ax-val-none"></a></span>
                                            </div>
                                        </div>
                                    </div>
                                </div>

                                <div class="ax-break-md"></div>

                                <div class="ax-form-group">
                                    <div class="ax-flex-row">
                                        <div class="ax-form-con">
                                            <div class="ax-form-input">
                                                <div class="ax-row">
                                                    <div class="ax-flex-block">
                                                        <span class="ax-pos-left" style="width:2.4rem;"><i class="ax-iconfont ax-icon-shield-f"></i></span>
                                                        <input name="username" placeholder="输入验证码..." value="" type="text"><span class="ax-pos-right"><a href="###" class="ax-iconfont ax-icon-close ax-val-none"></a></span>
                                                    </div>
                                                    <a href="###" class="ax-form-img"><img src="images/yanzhengma.jpg"></a>
                                                </div>
                                            </div>

                                        </div>
                                    </div>
                                </div>


                                <div class="ax-break-md"></div>

                                <div class="ax-form-group">
                                    <div class="ax-flex-row">
                                        <div class="ax-form-con">
                                            <div class="ax-form-input">
                                                <div class="ax-row">
                                                    <div class="ax-flex-block">
                                                        <label class="ax-checkbox"><input name="free-agree" value="0" checked="" type="checkbox"><span>记住密码</span></label>
                                                    </div>
                                                    <a href="###" class="ax-form-txt ax-color-ignore">忘记了密码？</a>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>


                                <div class="ax-break-md"></div>

                                <div class="ax-form-group">
                                    <div class="ax-flex-row">
                                        <div class="ax-flex-block">
                                            <div class="ax-form-input">
                                                <button type="button" class="ax-btn ax-primary ax-full">登录</button>
                                            </div>
                                        </div>
                                    </div>
                                </div>

                                <div class="ax-break"></div>
                                <div class="ax-break ax-hide-tel"></div>
                                <div class="ax-break ax-hide-tel"></div>

                            </form>
                        </li>
                        <li>
                            <form>

                                <div class="ax-break"></div>
                                <div class="ax-break ax-hide-tel"></div>

                                <div class="ax-form-group">
                                    <div class="ax-flex-row">
                                        <div class="ax-form-con">
                                            <div class="ax-form-input"><span class="ax-pos-left" style="width: 2.4rem;"><i class="ax-iconfont ax-icon-me-f"></i></span><input name="username" placeholder="输入名称" type="text"><span class="ax-pos-right"><a href="###" class="ax-iconfont ax-icon-close ax-val-none"></a></span></div>
                                        </div>
                                    </div>
                                </div>

                                <div class="ax-break-md"></div>

                                <div class="ax-form-group">
                                    <div class="ax-flex-row">
                                        <div class="ax-form-con">
                                            <div class="ax-form-input"><span class="ax-pos-left" style="width:2.4rem;"><i class="ax-iconfont ax-icon-lock-f"></i></span>
                                                <input name="password" placeholder="输入密码" type="password"><span class="ax-pos-right"><a href="###" class="ax-iconfont ax-icon-close ax-val-none"></a></span>
                                            </div>
                                        </div>
                                    </div>
                                </div>

                                <div class="ax-break-md"></div>

                                <div class="ax-form-group">
                                    <div class="ax-flex-row">
                                        <div class="ax-form-con">
                                            <div class="ax-form-input"><span class="ax-pos-left" style="width:2.4rem;"><i class="ax-iconfont ax-icon-lock-f"></i></span>
                                                <input name="password" placeholder="再次输入密码" type="password"><span class="ax-pos-right"><a href="###" class="ax-iconfont ax-icon-close ax-val-none"></a></span>
                                            </div>
                                        </div>
                                    </div>
                                </div>


                                <div class="ax-break-md"></div>

                                <div class="ax-form-group">
                                    <div class="ax-flex-row">
                                        <div class="ax-form-con">
                                            <div class="ax-form-input">
                                                <div class="ax-row">
                                                    <div class="ax-flex-block">
                                                        <label class="ax-checkbox"><input name="free-agree" value="0" checked="" type="checkbox"><span>注册成功后立即登录</span></label>
                                                    </div>
                                                    <a href="###" class="ax-form-txt ax-color-primary">有账号？立即登录</a>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>


                                <div class="ax-break-md"></div>

                                <div class="ax-form-group">
                                    <div class="ax-flex-row">
                                        <div class="ax-flex-block">
                                            <div class="ax-form-input">
                                                <button type="button" class="ax-btn ax-primary ax-full">注册</button>
                                            </div>
                                        </div>
                                    </div>
                                </div>

                                <div class="ax-break"></div>
                                <div class="ax-break ax-hide-tel"></div>
                                <div class="ax-break ax-hide-tel"></div>

                            </form>
                        </li>
                    </ul>
                </div>
            </div>
        </div>
    </div>
</div>

<!--正文结束-->

<div class="footer">
    &#xa9; 2022 <a href="https://www.axui.cn/" target="_self">Axui.cn</a> <a href="https://baike.baidu.com/item/MIT许可证" target="_blank" rel="nofollow">MIT license</a>
</div>

<script src="js/ax.min.js" type="text/javascript"></script>
</body>

</html>